<template>
	<view class="content">
		<view class="logoContainer">
			<image class="img" src="../../static/images/logo.png"></image>
			<view class="title">安全管理</view>
		</view>
		<!-- <view class="bigTitle">安全管理平台</view> -->
		<view class="mould">
			<view class="container">
				<view class="type" v-for="(item,index) in arr" :key='index' @click="goto(index)">
					<view>
						<image :src="item.url" mode=""></image>
					</view>
					<view>{{item.name}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getUserInfo
	} from '@/api/workTicket/index.js'
	export default {
		data() {
			return {
				recentArr: [{
						id: 1,
						name: '作业票',
						url: '../../static/images/work.png'
					},
					{
						id: 2,
						name: '隐患排查',
						url: '../../static/images/yinhuan.png'
					}
				],
				arr: [{
						id: 1,
						name: '作业票',
						url: '../../static/images/work.png'
					},
					{
						id: 2,
						name: '隐患排查',
						url: '../../static/images/yinhuan.png'
					}
				]
			};
		},
		mounted() {
			this.getUserInfo()
		},
		methods: {
			goto(index) {
				switch (index) {
					case 0:
						uni.navigateTo({
							url: "/pages/home/index",
							success() {
								console.log()
							},
							fail(e) {
								console.log(e)
							}
						})
						break;
				}
			},
			// 获取当前登录信息
			getUserInfo() {
				getUserInfo().then(res => {
					uni.setStorageSync('userName', res.userName);
					uni.setStorageSync('userId', res.userId)
					uni.setStorageSync('userDept', res.userDeptName)
				})
			}
		}
	}
</script>

<style>
  page {
    background-image: url('');
		background-size: 100% 100vh;
  }
</style>

<style scoped lang="scss">
	.content {
		position: relative;
		width: 100%;
		height: 88vh;
		position: relative;
		.img {
			width: 220rpx;
			height: 220rpx;
			margin-top: 8vh;
		}
	}

	.bigTitle {
		width: 100%;
		position: absolute;
		color: white;
		font-size: 100rpx;
		font-style: italic;
		top: 10vh;
		text-align: center;
		text-shadow: 10rpx 10rpx #3C9CFF;
	}

	.imgContainer {
		width: 100%;

		// ::v-deep uni-image {
		// 	display: block;
		// 	width: 100%;
		// }
		image {
			width: 100%;
		}
	}

	.title {
		width: 100%;
		padding-left: 5%;
		color: rgb(75, 116, 224);
		font-weight: bold;
		font-size: 40rpx;
	}

	.recent {
		border-bottom: 4rpx solid #E0E0E0;
	}

	.container {
		display: flex;
		justify-content: center;
	}

	.type {
		margin: 40rpx;

		image {
			width: 100rpx;
			height: 100rpx;
		}
	}
	.logoContainer{
	    margin: 0 auto;
	    display: flex;
	    justify-content: center;
		flex-direction: column;
	    align-items: center;
	    // height: 35vh;
	}
	.title{
		width: 100%;
		height: 124px;
		font-size: 100rpx;
		font-family: Source Han Sans CN;
		font-weight: bold;
		font-style: italic;
		color: #FDFFFE;
		text-align: center;
		text-shadow: 0px 17px 9px rgba(6, 64, 161, 0.39);
	}
</style>
